<template>
	<view class="content wrap">
		<u-form :model="form" ref="uForm" :rules="rules">
			<u-form-item label="姓名" label-width="150" left-icon="account" prop="temporaryName">
				<u-input v-model="form.temporaryName" placeholder="请输入姓名" />
			</u-form-item>

			<u-form-item label="手机号" label-width="150" left-icon="phone" prop="tel">
				<u-input v-model="form.tel" type="digit" placeholder="请输入手机号" />
			</u-form-item>

			<u-form-item label="身份证号" label-width="150" prop="idcard">
				<u-input v-model="form.idcard" type="idcard" placeholder="请输入身份证号" />
			</u-form-item>

			<u-form-item label="劳务公司" label-width="150" prop="laborServices">
				<u-input v-model="form.laborServices" placeholder="请输入劳务公司名称" />
			</u-form-item>

			<u-form-item label="工作岗位" label-width="150">
				<u-radio-group v-model="form.job">
					<u-radio @change="radioChange" v-for="(item, index) in worklist" :key="index" :name="item.name">
						{{item.name}}
					</u-radio>
				</u-radio-group>
			</u-form-item>

			<u-form-item label="计费模式" label-width="150">
				<u-radio-group v-model="form.billingMode">
					<u-radio @change="radioChange1" v-for="(item, index) in worklist1" :key="index" :name="item.name">
						{{item.name}}
					</u-radio>
				</u-radio-group>
			</u-form-item>

		</u-form>
		<u-button @click="clockin" :disabled="isDisabled" type="primary">签到</u-button>
		<view>
			<u-form-item>
			</u-form-item>
		</view>
		<u-button @click="clockout" :disabled="isDisabled" type="primary">签退</u-button>
		<view>
			<u-toast ref="uToast" />
		</view>
	</view>
</template>



<script>
	import config from '../../config.js'
	export default {
		data() {
			return {
				form: {
					temporaryName: "",
					tel: "",
					laborServices: "",
					job: "拣货",
					idcard:"",
					billingMode:"其它",
					operateId: '',
					isDisabled:false,
				},
				rules: {
					tel:[
							{
								required: true, 
								message: '请输入手机号',
								trigger: ['change','blur'],
							},
							{
								// 自定义验证函数，见上说明
								validator: (rule, value, callback) => {
									// 上面有说，返回true表示校验通过，返回false表示不通过
									// this.$u.test.mobile()就是返回true或者false的
									return this.$u.test.mobile(value);
								},
								message: '手机号码不正确',
								// 触发器可以同时用blur和change
								trigger: ['change','blur'],
							}
					]
				},
				olist: [],
				worklist: [{
						name: '拣货'
					},
					{
						name: '打包'
					},
					{
						name: '理货'
					},
					{
						name: '收货'
					},
					{
						name: '上架'
					},
					{
						name: '装车'
					},
					{
						name: '卸车'
					},
					{
						name: '内配员'
					},
					{
						name: '接货员'
					},
					{
						name: '异常处理'
					},
				],
				worklist1: [{
						name: '计时'
					},
					{
						name: '计件'
					},
					{
						name: '其它'
					},
				],
			};
		},
		onLoad: function(open) {
			//获取司机扫码的项目id
			try {
				var params1 = this.getQueryParams(open.q)
				if (typeof params1.warehouseId != 'undefined' && params1.warehouseId != '' && params1.warehouseId !=
					null) {
					this.form.operateId = params1.warehouseId
				}
			} catch (e) {
				let getStorageSyncOperateId = uni.getStorageSync('warehouseId')

				if (typeof getStorageSyncOperateId != 'undefined' && getStorageSyncOperateId != '' &&
					getStorageSyncOperateId != null) {
					this.form.operateId = getStorageSyncOperateId
				}
			}
		},
		// 必须要在onReady生命周期，因为onLoad生命周期组件可能尚未创建完毕
		onReady() {
			this.$refs.uForm.setRules(this.rules);
		},
		methods: {
			getQueryParams(queryString) {
				// 微信扫码得到的内容进行了一次编码，所以官方要求需要进行decodeURIComponent一次
				queryString = decodeURIComponent(queryString)
				let params = {}
				if (queryString) {
					let queryArray = queryString.split('?')
					if (queryArray.length > 1) {
						let query = queryArray[1]
						let array = query.split('&')
						array.map((value) => {
							let valueArray = value.split('=')
							if (valueArray.length > 1) {
								// 还需要对value进行解码（可能涉及到在value为中文字符，在赋值到二维码前进行encodeURI编码）
								Object.assign(params, {
									[valueArray[0]]: decodeURI(valueArray[1])
								})
							}
						})
					}
				}
				return params
			},
			clockin() {
				if (typeof this.form.temporaryName == 'undefined' || this.form.temporaryName == null || this.form
					.temporaryName == '') {
					uni.showToast({
						title: '请输入姓名',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.tel == 'undefined' || this.form.tel == null || this.form.tel == '') {
					uni.showToast({
						title: '请输入手机号码',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.idcard == 'undefined' || this.form.idcard == null || this.form.idcard == '') {
					uni.showToast({
						title: '请输入身份证号',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.laborServices == 'undefined' || this.form.laborServices == null || this.form
					.laborServices == '') {
					uni.showToast({
						title: '请输入劳务公司名称',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						uni.showModal({
							content: '确定签到吗？',
							success: (res) => {
								if (res.confirm) {
									var that = this
									that.isDisabled = true;
									uni.getLocation({
										type:'gcj02',
										altitude:false,
										success: function (res) {
											const latitude = res.latitude;
											const longitude = res.longitude;
											uni.request({
												method: "POST",
												//anth 是否验证，非必填， false: 不需要验证 true: 需要验证,默认为true需要验证.
												custom: {
													auth: false
												},
												header: {
													'content-type': 'application/x-www-form-urlencoded',
												},
												url: config.root +
													'/rest/temporary/signincode?longitude=' +
													longitude + '&latitude=' + latitude +
													'&temporaryName=' + that.form.temporaryName +
													'&tel=' + that.form.tel +
													'&idcard=' + that.form.idcard +
													'&billingMode=' + that.form.billingMode +
													'&laborServices=' + that.form.laborServices +
													'&job=' + that.form.job +
													'&warehouseId=' + that.form.operateId,
												data: {},
												success: (res) => {
													that.isDisabled = false;
													if (res.data.success) {
														uni.showModal({
															title: '签到成功',
															showCancel: false,
															success: (res) => {
																if (res.confirm) {
											
																} else if (res
																	.cancel) {
																	console.log(
																		'用户点击取消'
																	);
																}
															}
														});
													} else {
														uni.showToast({
															title: res.data.message,
															duration: 2000,
															icon: 'none',
														});
													}
												}
											})
										},
										fail:function(res){
											that.isDisabled = false;
											uni.showToast({
												title: '获取当前定位失败',
												duration: 2000,
												icon:'none',
											});
										},
									})
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						})
					} else {
						uni.showToast({
							title: '验证失败，请检查输入项',
							duration: 2000,
							icon: 'none',
						});
					}
				});
			},
			//下班签到
			clockout() {
				if (typeof this.form.temporaryName == 'undefined' || this.form.temporaryName == null || this.form
					.temporaryName == '') {
					uni.showToast({
						title: '请输入姓名',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.tel == 'undefined' || this.form.tel == null || this.form.tel == '') {
					uni.showToast({
						title: '请输入手机号码',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.idcard == 'undefined' || this.form.idcard == null || this.form.idcard == '') {
					uni.showToast({
						title: '请输入身份证号',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				if (typeof this.form.laborServices == 'undefined' || this.form.laborServices == null || this.form
					.laborServices == '') {
					uni.showToast({
						title: '请输入劳务公司名称',
						duration: 2000,
						icon: 'none',
					});
					return false;
				}
				this.$refs.uForm.validate(valid => {
					if (valid) {
						uni.showModal({
							content: '确定签退吗？',
							success: (res) => {
								if (res.confirm) {
									var that = this
									that.isDisabled = true;
									uni.getLocation({
										type:'gcj02',
										altitude:false,
										success: function (res) {
											const latitude = res.latitude;
											const longitude = res.longitude;
											uni.request({
												method: "POST",
												//anth 是否验证，非必填， false: 不需要验证 true: 需要验证,默认为true需要验证.
												custom: {
													auth: false
												},
												header: {
													'content-type': 'application/x-www-form-urlencoded',
												},
												url: config.root +
													'/rest/temporary/signoutcode?longitude=' +
													longitude + '&latitude=' + latitude +
													'&temporaryName=' + that.form.temporaryName +
													'&tel=' + that.form.tel + 
													'&idcard=' + that.form.idcard +
													'&billingMode=' + that.form.billingMode +
													'&laborServices=' +that.form.laborServices + 
													'&job=' + that.form.job +
													'&warehouseId=' + that.form.operateId,
												data: {},
												success: (res) => {
													that.isDisabled = false;
													if (res.data.success) {
														uni.showToast({
															title: '签退成功，您辛苦啦',
															duration: 2000
														});
													} else {
														uni.showToast({
															title: res.data.message,
															duration: 2000,
															icon: 'none',
														});
													}
												}
											})
										},
										fail:function(res){
											that.isDisabled = false;
											uni.showToast({
												title: '获取当前定位失败',
												duration: 2000,
												icon:'none',
											});
										},
									})
								} else if (res.cancel) {
									console.log('用户点击取消');
								}
							}
						})
					} else {
						uni.showToast({
							title: '验证失败，请检查输入项',
							duration: 2000,
							icon: 'none',
						});
					}
				});
			},
			// 选中某个单选框时，由radio时触发
			radioChange(e) {
				console.log(e);
			},
			// 选中某个单选框时，由radio时触发
			radioChange1(e) {
				console.log(e);
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #ffffff;
	}

	.wrap {
		padding: 30rpx;
	}
</style>
